<template>
    <div class="entranceregister">
        <div class="loginHeader">
            <div class="headercont set-left-center">
                <el-image class="img" :src="require('@/assets/images/icon/logo1.png')" fit="fill" />
                <el-button type="" link>帮助中心 </el-button>
            </div>
        </div>
        <div class="entranceCont">
            <div class="succeed">
                <!-- <center> -->
                <el-image class="img set-left-center" :src="require('@/assets/image/dui.png')" fit="fill" />
                <div class="succeedTip">开通成功，欢迎加入云上农场</div>
                <div class="succeedBtn">
                    <el-button type="primary" @click="tosystempage('/user/mymanagement/certificateauth')">实名认证</el-button>
                    <el-button plain @click="tosystempage('/index')">返回原页面</el-button>
                </div>
                <!-- </center> -->
                <div class="newuser">
                    <div class="newusertitle">新用户推荐</div>
                    <div class="newuserBox">
                        <div class="newuserItem newuserItem1" @click="tosystempage('')">
                            <div class="newusertitle">农场产品专区</div>
                            <div class="newuserms">30+热销云上农场产品，提供 <span>10000+</span> 农场产品</div>
                            <el-image class="img" :src="require('@/assets/image/recommend1.png')" fit="fill" />
                        </div>
                        <div class="newuserItem newuserItem2" @click="tosystempage('')">
                            <div class="newusertitle">服务市场专区</div>
                            <div class="newuserms"><span>3000+</span> 热门服务市场产品，最长免费试用12个月</div>
                            <el-image class="img" :src="require('@/assets/image/recommend2.png')" fit="fill" />
                        </div>
                        <div class="newuserItem newuserItem3" @click="tosystempage('')">
                            <div class="newusertitle">解决方案专区</div>
                            <div class="newuserms">20+畅销解决方案，最长免费试用12个月</div>
                            <el-image class="img" :src="require('@/assets/image/recommend3.png')" fit="fill" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="entranceFooterBox">
            <div class="entranceFooter set-left-center">
                <div class="copyright">
                    © 2009-2022szfarm.com 重庆三峡农夫科技有限公司 版权所有
                    <p>网站备案：渝ICP备2020013911号 <span> 渝公网安备XXX号</span></p>
                </div>
                <div>
                    <el-button type="info" link class="btnBox-btn">用户协议</el-button>
                    <el-button type="info" link class="btnBox-btn">隐私声明</el-button>
                </div>
            </div>
        </div>
    </div>
</template>
<script lang="ts" setup>
import { useRouter } from "vue-router";
import { login } from "@/api/auth";
const router = useRouter();
const tosystempage = (u: string) => {
    router.replace(u);
    return;
    let np: any = JSON.parse((sessionStorage as any).getItem("np"));
    if (np) {
        login({ name: np.n, pwd: np.p }).then((res) => {
            router.replace(u);
            // sessionStorage.removeItem("np");
        });
    } else {
        router.replace("/login");
        sessionStorage.clear();
    }
};
</script>
<style lang="scss" scoped>
.loginHeader {
    width: 100%;
    height: 45px;
    background: #ffffff;
    padding: 0 40px;
    .headercont {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 1600px;
        height: 45px;
    }

    .img {
        // width: 120px;
        height: 40px;
    }
    .headertitle {
        font-size: 16px;
        font-weight: bold;
        color: #333333;
        margin-left: 45px;
    }
}
.entranceCont {
    background-image: url(@/assets/image/loginbgimg.png);
    width: 100%;
    height: calc(100vh - 115px);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display: flex;
    justify-content: center;
    padding-top: 40px;
    .succeed {
        width: 992px;
        height: 395px;
        background: #ffffff;
        box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.1);
        border-radius: 6px;
        padding: 40px;
        .img {
            width: 24px;
            height: 24px;
        }
        .succeedTip {
            margin-top: 20px;
            text-align: center;
            margin-bottom: 40px;
            font-size: 18px;
        }
        .succeedBtn {
            text-align: center;
        }
    }
    .newuser {
        border-top: 1px solid #cccccc;
        margin-top: 30px;
        padding-top: 30px;
        .newusertitle {
            font-size: 16px;
            color: #575d6c;
        }
        .newuserBox {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 20px;
            .newuserItem {
                width: 288px;
                height: 76px;
                box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.1);
                margin: 0 7px;
                padding: 20px;
                position: relative;
                cursor: pointer;
                .newusertitle {
                    font-size: 16px;
                    color: #333333;
                    position: relative;
                    z-index: 1;
                }
                .newuserms {
                    font-size: 8px;
                    color: #666666;
                    margin-top: 10px;
                    position: relative;
                    z-index: 1;
                    span {
                        color: #23b14d;
                    }
                }
                .img {
                    position: absolute;
                    bottom: 0;
                    z-index: 0;
                }
            }
            .newuserItem1 {
                background: linear-gradient(90deg, #d7e4ed, #e9eef2);
                .img {
                    right: 6px;
                    width: 72px;
                    height: 74px;
                }
            }
            .newuserItem2 {
                background: linear-gradient(90deg, #eff0f2, #f2f3f7);
                .img {
                    right: 2px;
                    width: 103px;
                    height: 66px;
                }
            }
            .newuserItem3 {
                background: linear-gradient(90deg, #ddeefe, #d0def3);
                .img {
                    right: 0;
                    width: 95px;
                    height: 74px;
                }
            }
        }
    }
}
.entranceFooterBox {
    width: 100%;
    height: 70px;
    background: #ffffff;
    padding: 20px 40px;
    .entranceFooter {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        width: 1600px;
        height: 45px;
        .copyright {
            font-size: 12px;
            span {
                margin-left: 20px;
            }
        }
    }
}
</style>
